<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head th:include="common/common :: common_head(~{::title},~{},~{})">
    <title>统计首页</title>
</head>
<script>
    Ext.onReady(function() {
        var accordion = Ext.create("Ext.panel.Panel", {
            title: "west",
            layout: "accordion", //设置为手风琴布局
            layoutConfig: {
                animate: true
            },
            width: 250,
            minWidth: 90,
            region: "west", //设置方位
            split: true,
            collapsible: true,
            items: [{
                id: 'desireChange',
                title: "嵌套面板一",
                html: "嵌套面板一",
                iconCls: "Tablesave"
            }, {
                title: "嵌套面板二",
                html: "嵌套面板二",
                iconCls: "search"
            }, {
                title: "嵌套面板三",
                html: "嵌套面板三",
                iconCls: "back"
            }, {
                title: "嵌套面板四",
                html: "嵌套面板四",
                iconCls: "12"
            }]
        });

        new Ext.Viewport({
            title: "Viewport",
            layout: "border", //这里是（border）边界布局
            defaults: {
                bodyStyle: "background-color: #FFFFFF;",
                frame: true
            },
            items: [
                accordion, //这里是（accordion）手风琴布局
                {
                    region: "north",
                    height: 100,
                    title: 'north',
                    collapsible: true
                }, {
                    region: "center",
                    split: true,
                    border: true,
                    collapsible: true,
                    title: 'center'
                }
            ]
        });
    });
</script>
<body>

</body>

</html>